<template>
	<view class="mainPage content" :style="{'padding-top': `${$store.state.safeArea.top || 0}px`, 'padding-bottom': `${$store.state.safeArea.bottom || 0}px`}">
		<public-head :title="title"></public-head>
		<view v-for="(item,index) in list" :key="index">
			<view class="box">
				<view class="title">
					<view class="text">我的姓名</view>
					<view class="text2"> {{item.user_name}}</view>
				</view>
				<view class="title">
					<view class="text"> 身份证号码</view>
					<view class="text2">{{item.idcard}}</view>
				</view>
				<view class="title">
					<view class="text">所属科室</view>
					<view class="text2">{{item.col_name}}</view>
				</view>
			</view>
			<view class="box2">
				<view class="title">资格证书</view>
				<view class="veterinary">
					<view class="title">执业兽医师证</view>
					<view class="img">
						<u-image width="100%" height="300rpx" :src="item.practice_cer"></u-image>
					</view>
				</view>
				<view class="veterinary" v-if="item.petdoc_cer">
					<view class="title">职称证书</view>
					<view class="img">
						<u-image width="100%" height="300rpx" :src="item.petdoc_cer"></u-image>
					</view>
				</view>
			</view>
			<view class="box3">
				<view class="title">擅长领域</view>
				<view class="text">
					<text>{{item.skills}}</text>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
var that
import publicHead from "@/components/publicHead/publicHead.vue"
export default {
	components: {
		publicHead
	},
	data() {
		return {
			title: "我的认证",
			list: '',
			img: [
				{ src: 'https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/img/certificates.png' },
				{ src: 'https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/img/certificates.png' }
			]
		}
	},
	onLoad() {
		that = this
		that.authentication()
	},
	methods: {
		authentication() {
			that.$postAjax1('PetDoctor_Center_certified', {
			}, function (data) {
				that.list = data.data.data
				console.log('我的认证获取成功')
			})
		}
	}
}
</script>
<style  scoped lang="scss">
.content {
	width: 100vw;
	height: 100vh;
	background: #f6f6f6;
	.box {
		background: #ffffff;
		padding: 30rpx;
		.title {
			padding: 20rpx 15rpx;
			width: 100%;
			.text {
				width: 30%;
				display: inline-block;
			}
			.text2 {
				width: 70%;
				display: inline-block;
				color: #979797;
			}
		}
	}
	.box2 {
		margin-top: 16rpx;
		background: #ffffff;
		padding: 30rpx;
		.title {
			padding: 20rpx 15rpx;
		}
		.veterinary {
			margin: 20rpx;
			padding: 20rpx;
			background-color: #f6f6f6;
			height: 340rpx;
			width: 100%;
			position: relative;
			clear: both;
			.title {
				display: inline-block;
				width: 35%;
				float: left;
				line-height: 340rpx;
			}
			.img {
				display: inline-block;
				width: 65%;
				float: right;
			}
		}
	}
	.box3 {
		margin-top: 16rpx;
		background: #ffffff;
		padding: 30rpx;
		.title {
			padding: 20rpx 15rpx;
		}
		.text {
			background: linear-gradient(227deg, #f6f5f8 0%, #f6f5f8 100%);
			border-radius: 12rpx;
			filter: blur(0px);
			padding: 30rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #3b3535;
			line-height: 40rpx;
		}
	}
}
</style>
